import React from 'react';
import ReactDOM from 'react-dom';
import { BrowserRouter as Router, Route, Link } from 'react-router-dom';
import Moment from "moment";
import { Button, Menu } from "antd";
//样式
import "./css/common/common.scss";
import "./css/common/components.scss";
import "./css/common/layout.scss";
import "./css/page/home.scss";
import "./css/page/curve.scss";
import "./css/page/vibPage.scss";
import "./css/page/faultPage.scss";
import "./css/index.scss";
import 'antd/dist/antd.css';
import "./css/page/secPage.scss"
//组件
import Curve from "./page/curve";
import Home from "./page/home";
import ElecPage from './page/elecPage';
import VibPage from './page/vibPage';
import FaultPage from './page/faultPage';
import TcPage from './page/tcPage';

//图片
import navLeftImg from "./imgs/ksh31.png";
import navRightImg from "./imgs/ksh32.png";
import conBot_1 from "./imgs/ksh42.png";
import conBot_2 from "./imgs/ksh43.png";
import conBot_4 from "./imgs/ksh44.png";
import conBot_3 from "./imgs/ksh45.png";
import borderImg from "./imgs/ksh34.png";

// class Jump extends React.Component {
//     constructor(props) {
//         super(props);
//         this.state = {
//             flag: false,
//             nowTime: "",
//         }
//     }
//     render() {
//         var path = this.state.flag ? "/" : "/curve";
//         return (
//             <Link className="navi-link" to={path} onClick={() => this.handleClick()}>鹤岗鸟山煤矿大数据展示平台</Link>
//         );
//     }
//     handleClick() {
//         this.setState({
//             flag: !this.state.flag,
//         });
//     }
// }



class Main extends React.Component {
    constructor(props) {
        super(props);
        this.state = {
            nowTime: "",
        }
    }
    componentDidMount() {
        this.timerID = setInterval(() => {
            this.setState({
                nowTime: Moment(new Date()).format("YYYY年MM月DD日 HH:mm:ss"),
            })
        }, 500);
    }
    componentWillUnmount() {
        clearInterval(this.timerID);
    }
    render() {
        return (
            <div id="home" className="my-page">
                <Router>
                    <nav>
                        <div className="fir"></div>
                        <div className="page-title-main">
                            <div className="route-btn-left">
                                <img src={conBot_1} alt="" className="conbot-1" />
                                <img src={conBot_2} alt="" className="conbot-2" />
                                <img src={conBot_3} alt="" className="conbot-3" />
                                <img src={conBot_4} alt="" className="conbot-4" />
                                <Link to={{pathname:"/",state:{flag:true}}} className="r-link">主井页面</Link>
                            </div>
                            <div className="left-tri"></div>
                            <div className="title-main">
                                <Link to="/curve" className="nav-link">鹤岗鸟山矿提升大数据可视化平台</Link>
                            </div>
                            <div className="right-tri"></div>
                            <div className="route-btn-right">
                                <img src={borderImg} alt="" className="i-img-1" />
                                <img src={borderImg} alt="" className="i-img-2" />
                                <img src={borderImg} alt="" className="i-img-3" />
                                <img src={borderImg} alt="" className="i-img-4" />
                                <Link to={{pathname:"/",state:{flag:false}}} className="r-link">副井页面</Link>
                            </div>
                        </div>
                        {/* <Button ghost>主井</Button>
                        <img src={navLeftImg} alt=""/>
                        <div><Link to="/curve" className="nav-link">鹤岗鸟山矿提升大数据可视化平台</Link></div>
                        <img src={navRightImg} alt=""/>
                        <Button ghost>副井</Button> */}
                    </nav>
                    <div>
                        {/* <Route path="/" exact component={Home}></Route>*/}

                        <Route path="/" exact component={Home}></Route>
                        <Route path="/curve" exact component={Curve}></Route>
                        <Route path="/elecPage" exact component={ElecPage}></Route>
                        <Route path="/tcPage" exact component={TcPage}></Route>
                        <Route path="/vibPage" exact component={VibPage}></Route>
                        <Route path="/faultPage" exact component={FaultPage}></Route>
                    </div>
                </Router>
            </div>
        );
    }
}

ReactDOM.render(
    <Main />,
    document.getElementById("root")
);